<template>
  <div class="my-tag">
    <input class="input"
           type="text"
           placeholder="输入标签"
           v-if="flag" 
           @blur="hiddenClick"
           v-select
           v-model="tag"/>
    <div class="text"
         @dblclick="showInput"
         v-else
         >{{value}}</div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      flag:false,
      tag:''
    }
  },
  methods:{
    showInput(){
      this.flag=true
      this.tag=this.value
    },
    hiddenClick(){
      this.flag=false
      this.$emit('input',this.tag)
    }
  },
  props:{
    value:{
      type:String,
      required:true
    }
  }
}
</script>

<style lang="less" scoped>
</style>